<!DOCTYPE html>
<html lang="zxx" xmlns:th="http://www.thymeleaf.org">
<head>
	<title>小型购物商城</title>
	<meta charset="UTF-8">
	<meta name="description" content="The Plaza eCommerce Template">
	<meta name="keywords" content="plaza, eCommerce, creative, html">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<!-- Favicon -->   
	<link href="/asserts/img/favicon.ico" rel="shortcut icon"/>

	<!-- Google Fonts -->
	<link href="https://fonts.googleapis.com/css?family=Raleway:400,400i,500,500i,600,600i,700,700i" rel="stylesheet">

	<!-- Stylesheets -->
	<link rel="stylesheet" href="/asserts/css/bootstrap.min.css"/>
	<link rel="stylesheet" href="/asserts/css/font-awesome.min.css"/>
	<link rel="stylesheet" href="/asserts/css/owl.carousel.css"/>
	<link rel="stylesheet" href="/asserts/css/style.css"/>
	<link rel="stylesheet" href="/asserts/css/animate.css"/>


	<!--[if lt IE 9]>
	  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->

</head>
<body>
	<!-- Page Preloder -->
	<div id="preloder">
		<div class="loader"></div>
	</div>
	
	<!-- Header section -->
	<header class="header-section header-normal">
		<div class="container-fluid">
			<!-- logo -->
			<div class="site-logo">
				<img src="/asserts/img/logo.png" alt="logo">
			</div>
			<!-- responsive -->
			<div class="nav-switch">
				<i class="fa fa-bars"></i>
			</div>
			<div class="header-right">
				<a href="car" class="card-bag"><img src="/asserts/img/icons/bag.png" alt=""><a style="color: purple;" >购物车</a></a>

			</div>
			<!-- site menu -->
			<ul class="main-menu">
				<li><a href="resign">返回登录</a></li>
				<li><a href="index">商城首页</a></li>
				<li><a href="checkout">结账</a></li>
				<li><a href="categorie">商品总览</a></li>
				<li><a href="contact">联系我们</a></li>
				<li><a href="chanpwd">修改密码</a></li>
			</ul>
		</div>
	</header>
	<!-- Header section end -->


	<!-- Page Info -->
	<div class="page-info-section page-info-big">
		<div class="container">
			<h2>商品总览</h2>
			<div class="site-breadcrumb">
				<a href="index">Home</a> /
				<span>商品总览</span>/
				<span>美味の食品</span>
			</div>
			<img src="/asserts/img/plmm.jpg" alt="" class="cata-top-pic">
		</div>
	</div>
	<!-- Page Info end -->


	<!-- Page -->
	<div class="page-area categorie-page spad">
		<div class="container">
			<div class="categorie-filter-warp">
				<p>展示12个商品</p>
				<div class="cf-right">
					<div class="cf-layouts">
						<a href="#"><img src="/asserts/img/icons/layout-1.png" alt=""></a>
						<a class="active" href="#"><img src="/asserts/img/icons/layout-2.png" alt=""></a>
					</div>

				</div>
			</div>
			<div class="row">
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/1.jpg" alt="">
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>李子七面条</h6>
							<p>$1</p>
							<a th:href="@{addToCart(index=1)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/2.jpg" alt="">
							<div class="bache">NEW</div>
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>亲嘴烧</h6>
							<p>$2</p>
							<a th:href="@{addToCart(index=2)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/3.jpg" alt="">
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>小蛋糕</h6>
							<p>$3</p>
							<a th:href="@{addToCart(index=3)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/4.jpg" alt="">
							<div class="bache sale">SALE</div>
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>紫薯片</h6>
							<p>$2  </p>
							<a th:href="@{addToCart(index=4)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/5.jpg" alt="">
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>猪肉脯</h6>
							<p>$2</p>
							<a th:href="@{addToCart(index=5)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/6.jpg" alt="">
							<div class="bache">NEW</div>
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>三只松鼠</h6>
							<p>$4</p>
							<a th:href="@{addToCart(index=6)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/7.jpg" alt="">
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>果蔬脆片</h6>
							<p>$3</p>
							<a th:href="@{addToCart(index=7)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/8.jpg" alt="">
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>果冻</h6>
							<p>$0.5  </p>
							<a th:href="@{addToCart(index=8)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/9.jpg" alt="">
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>麻花</h6>
							<p>$2</p>
							<a th:href="@{addToCart(index=9)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/10.jpg" alt="">
							<div class="bache">NEW</div>
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>可口可乐</h6>
							<p>$0.5</p>
							<a th:href="@{addToCart(index=10)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/11.jpg" alt="">
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>乐事薯片</h6>
							<p>$1</p>
							<a th:href="@{addToCart(index=11)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
				<div class="col-lg-3">
					<div class="product-item">
						<figure>
							<img src="/asserts/img/products/foods/12.jpg" alt="">
							<div class="pi-meta">
								<div class="pi-m-left">
									<img src="/asserts/img/icons/eye.png" alt="">
									<p></p>
								</div>
								<div class="pi-m-right">
									<img src="/asserts/img/icons/heart.png" alt="">
									<p></p>
								</div>
							</div>
						</figure>
						<div class="product-info">
							<h6>麻辣小龙虾</h6>
							<p>$5  </p>
							<a th:href="@{addToCart(index=12)}" class="site-btn btn-line">置入购物车</a>
						</div>
					</div>
				</div>
			</div>
			<div class="site-pagination">
				<span class="active" ></span>
				<a href="categorie">01.</a>
				<a href="other">02.</a>
				<a href="shoe">03.</a>

			</div>
		</div>
	</div>
	<!-- Page -->


	<!-- Footer top section -->	
	<section class="footer-top-section home-footer">
		<div class="container">
			<div class="row">
				<div class="col-lg-3 col-md-8 col-sm-12">
					<div class="footer-widget about-widget">
						<img src="/asserts/img/logo.png" class="footer-logo" alt="">
						<p></p>
				
					</div>
				</div>
				<div class="col-lg-2 col-md-4 col-sm-6">
					<div class="footer-widget">
						<h6 class="fw-title">友情链接</h6>
						<ul>
							<li><a href="#">合作伙伴</a></li>
							<li><a href="#">博客</a></li>
							<li><a href="#">支持</a></li>
							<li><a href="#">使用条款</a></li>
						</ul>
					</div>
				</div>
				<div class="col-lg-2 col-md-4 col-sm-6">
					<div class="footer-widget">
						<h6 class="fw-title">网站导航</h6>
						<ul>
							<li><a href="resign">返回登录</a></li>
							<li><a href="index">商品首页</a></li>
							<li><a href="checkout">结账</a></li>
							<li><a href="categorie">商品总览</a></li>
							<li><a href="contact">联系我们</a></li>

						</ul>
					</div>
				</div>
				<div class="col-lg-2 col-md-4 col-sm-6">
					<div class="footer-widget">
						<h6 class="fw-title">运送与退货</h6>
						<ul>
							<li><a href="#">关于我们</a></li>
							<li><a href="#">跟踪订单</a></li>
							<li><a href="#">退货</a></li>
							<li><a href="#">运输</a></li>
						</ul>
					</div>
				</div>
				<div class="col-lg-2 col-md-4 col-sm-6">
					<div class="footer-widget">
						<h6 class="fw-title">意见反馈</h6>
						<div class="text-box">
							<p>经营人地址 </p>
							<p>湖南省湘潭市雨湖区湖南科技大学</p>
							<p>客服电话：18873242003</p>
							<p>联系邮箱：zty1119094861@sina.com</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- Footer top section end -->	


	<!-- Footer section -->
	<footer class="footer-section">
		<div class="container">
			<p class="copyright">
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
</p>
		</div>
	</footer>
	<!-- Footer section end -->


	<!--====== Javascripts & Jquery ======-->
	<script src="/asserts/js/jquery-3.2.1.min.js"></script>
	<script src="/asserts/js/bootstrap.min.js"></script>
	<script src="/asserts/js/owl.carousel.min.js"></script>
	<script src="/asserts/js/mixitup.min.js"></script>
	<script src="/asserts/js/sly.min.js"></script>
	<script src="/asserts/js/jquery.nicescroll.min.js"></script>
	<script src="/asserts/js/main.js"></script>
    </body>
</html>